﻿<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<base href="<%=basePath%>">

		<link rel="shortcut icon" href="image/favicons.ico"
			type="image/x-icon" />
		<title></title>
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<meta http-equiv="expires" content="0">
		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="This is my page">
		<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
		<style type="text/css">
.accordion {
	width: 100%;
	margin: 30px auto 20px;
	background: #FFF;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}

.accordion .link {
	cursor: pointer;
	display: block;
	padding: 15px 15px 15px 42px;
	font-size: 14px;
	font-weight: 700;
	position: relative;
	-webkit-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
}

.accordion li:last-child .link {
	border-bottom: 0;
}

.accordion li i {
	position: absolute;
	top: 16px;
	left: 12px;
	font-size: 18px;
	-webkit-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
}

.accordion li i.fa-chevron-down {
	right: 12px;
	left: auto;
	font-size: 16px;
}

.accordion li.open .link {
	
}

.accordion li.open i {
	
}

.accordion li.open i.fa-chevron-down {
	-webkit-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	transform: rotate(90deg);
}

/**
 * Submenu
 -----------------------------*/
.submenu {
	display: none;
	font-size: 14px;
}

.submenu li {
	
}

.submenu a {
	display: block;
	text-decoration: none;
	padding: 12px;
	padding-left: 42px;
	-webkit-transition: all 0.25s ease;
	-o-transition: all 0.25s ease;
	transition: all 0.25s ease;
}

.submenu a:hover {
	
}
</style>
		<script type="text/javascript">
	$(function() {
	var Accordion = function(el, multiple) {
		this.el = el || {};
		this.multiple = multiple || false;

		// Variables privadas
		var links = this.el.find('.link');
		// Evento
		links.on('click', {el: this.el, multiple: this.multiple}, this.dropdown)
	}

	Accordion.prototype.dropdown = function(e) {
		var $el = e.data.el;
			$this = $(this),
			$next = $this.next();

		$next.slideToggle();
		$this.parent().toggleClass('open');

		if (!e.data.multiple) {
			$el.find('.submenu').not($next).slideUp().parent().removeClass('open');
		};
	}	

	var accordion = new Accordion($('#accordion'), false);
});
	</script>
	</head>

	<body class="skin-blue">
		<div class="">
			<!-- Content Wrapper. Contains page content -->
			<div class="">
				<!-- Content Header (Page header) -->
				<section class="content-header">
				<h1>
					<ol class="breadcrumb">

						<li>
							列表信息
						</li>
					</ol>
				</h1>


				</section>

				<!-- Main content -->
				<section class="content">
				 <a href="<%=basePath%>admin/goaddf" style="margin-right:0px;"><button   class="btn  btn-info btn-xs info" style="width:80px;">添加一级标题</button></a>
				<div class="row">
					<div class="col-xs-12">

						<div class="box">
							<div class="box-body">
								<ul class="accordion">
									<li style="list-style: none;"><div class="link">
										<table id="example2" class="table table-bordered table-hover">
											<tr>
												<th width="20%">
													一级标题
												</th>
												<th width="20%">
													路径
												</th>
												<th width="20%">
													排序
												</th>
												<th>
													操作
												</th>
											</tr>
										</table>
									</div></li>
								</ul>
								<ul id="accordion" class="accordion">

									<c:forEach items="${flist}" var="c">
										<li style="list-style: none;">
											<div class="link">
												<i class="fa fa-paint-brush"></i>
												<table id="example2"
													class="table table-bordered table-hover">

													<tr>

														<td width="20%">
															${c.title}
														</td>
														<td width="20%">
															${c.url }
														</td>
														<td width="20%">
															${c.sort }
														</td>
														<td>
															<button onclick="add(${c.id})"
																class="btn  btn-info btn-xs info">
																添加二级标题
															</button>
															<button onclick="updatef(${c.id})"
																class="btn  btn-info btn-xs info" style="width: 50px;">
																修改
															</button>
															<button onclick="pubf(${c.id})"
																class="btn  btn-info btn-xs info" style="width: 50px;">
																发布
															</button>
															<button onclick="delf(${c.id})"
																class="btn  btn-info btn-xs info" style="width: 50px;">
																删除
															</button>
														</td>
													</tr>
												</table>
												<i class="fa fa-chevron-down"></i>
											</div>
											<ul class="submenu">
												<c:forEach items="${gklist}" var="gk">
													<c:if test="${c.id == gk.tit.id}">
														<li>
															<table id="example2"
																class="table table-bordered table-hover">
																<tr>

																	<th width="20%">
																		二级标题
																	</th>
																	<th width="20%">
																		路径
																	</th>
																	<th width="20%">
																		排序
																	</th>
																	<th>
																		操作
																	</th>
																</tr>
																<tr>
																	<td>
																		${gk.title}
																	</td>
																	<td>
																		${gk.url }
																	</td>
																	<td>
																		${gk.sort }
																	</td>
																	<td>
																		<button onclick="update(${gk.id})"
																			class="btn  btn-info btn-xs info"
																			style="width: 50px;">
																			修改
																		</button>
																		<button onclick="pub(${gk.id})"
																			class="btn  btn-info btn-xs info"
																			style="width: 50px;">
																			发布
																		</button>
																		<button onclick="del(${gk.id})"
																			class="btn  btn-info btn-xs info"
																			style="width: 50px;">
																			删除
																		</button>
																	</td>
																</tr>
															</table>
														</li>
													</c:if>
												</c:forEach>

											</ul>
										</li>

									</c:forEach>

								</ul>
								<!-- 翻页 -->
							</div>
							<!-- /.box-body -->
						</div>
						<!-- /.box -->
					</div>
					<!-- /.col -->
				</div>
				<!-- /.row -->
				</section>
				<!-- /.content -->
			</div>
			<!-- /.content-wrapper -->
		</div>
		<!-- ./wrapper -->
		<script type="text/javascript">

		$("#js").addClass("active");
		$("#js").find("li:first").next().addClass("active");
		
        $("#example2").dataTable({
		 	"bPaginate": true, // 翻页功能
			"bLengthChange": false, // 改变每页显示数据数量
			"bFilter": false, // 过滤功能
			"bSort": false, // 排序功能
			"bInfo": true, // 页脚信息
			"oLanguage" : {
                "sLengthMenu" : "每页显示_MENU_条记录",
                "sZeroRecords" : "抱歉， 没有找到记录",
                "sInfo" : "从 _START_ 到 _END_ /共 _TOTAL_ 条数据",
                "sInfoEmpty" : "没有数据",
                "sInfoFiltered" : "(从 _MAX_ 条数据中检索)",
                "oPaginate" : {
                    "sFirst" : "首页",
                    "sPrevious" : "前一页",
                    "sNext" : "后一页",
                    "sLast" : "尾页"
                },
                "sZeroRecords" : "没有检索到数据",
                "sProcessing" : "正在加载中..."
            },
			"bAutoWidth": true, // 自动宽度
		});
		
	 function update(id) {
		location.href="<%=basePath%>admin/goupdates?id="+id;
	 }
	  function del(id) {
	    if(confirm("是否删除")){
		  	location.href= "<%=basePath%>admin/dels?id="+id; 
		}
	    else
	        alert("未能删除");
	  }
	   function pub(id) {
	  	location.href= "<%=basePath%>admin/pubs?id="+id; 
	  }
	  function updatef(id) {
		location.href="<%=basePath%>admin/goupdatef?id="+id;
	 }
	  function delf(id) {
	    if(confirm("是否删除")){
		  	location.href= "<%=basePath%>admin/delf?id="+id; 
		}
	    else
	        alert("未能删除");
	  }
	   function pubf(id) {
	  	location.href= "<%=basePath%>admin/pubf?id="+id; 
	  }
	   function add(id) {
	  	location.href= "<%=basePath%>admin/goadds?id="+id; 
	  }
	</script>
	</body>
</html>
